<!DOCTYPE html>
<html>
{include file="public/header" /}
<body>
<style>


    .s {
        clear: both;
        margin-top: 10px
    }

    .check {
        border-color: red;
        border-width: 2px;
    }

    .upload_more {
        margin: 5px;
        height: 120px;
        width: 120px;
    }

    .form-footer2{
        position: fixed;
        bottom: 0px;
        width: 100%;
        left: 0;
        margin-bottom: 0;
    }

</style>

<div class="layui-fluid" id="app">
    <div class="layui-row layui-col-space15">
        <div class="layui-col-md12">
            <form class="layui-form " action="">
            <div class="layui-form-item">
                <label class="layui-form-label">项目进度</label>
                <div class="layui-input-inline">
                    <select name="title" lay-verify="required">
                        <option value="">请选择一个进度</option>
                        <option value="水电工程">水电工程</option>
                        <option value="拆除工程">拆除工程</option>
                        <option value="瓦工工程">瓦工工程</option>
                        <option value="油工工程">油工工程</option>
                        <option value="木作安装">木作安装</option>
                        <option value="竣工保洁">竣工保洁</option>
                    </select>
                </div>
                <div class="layui-form-mid">开始时间</div>
                <div class="layui-input-inline">
                    <input type="text" class="layui-input" id="time" name="start_time"
                           placeholder="请选择"
                           lay-verify="required">
                </div>
            </div>


            <div class="layui-form-item">
                <label class="layui-form-label">选择图纸</label>
                <div class=" layui-input-block ">


                    <div class="layui-upload-drag upload_more check" style="padding: 2px;"
                         onclick="checkTuzhi(this)">
                        <div style="margin-top: 5px;width: 80px" class="layui-elip">
                            平面及建筑标记图
                        </div>
                        <img class="layui-upload-img"
                             style="width: 80px;height: 80px; object-fit: cover;"
                             src="{$qn_domain}/{$tuzhi.biaoji}?imageMogr2/auto-orient/thumbnail/!80x80r/gravity/Center/crop/80x80/quality/80/interlace/0">
                        <input type="hidden" id="biaoji" value="{$tuzhi.biaoji}">
                    </div>

                    <div class="layui-upload-drag upload_more" style="padding: 2px;"
                         onclick="checkTuzhi(this)">
                        <div style="margin-top: 5px;" class="layui-elip">
                            原始尺寸测量图
                        </div>
                        <img class="layui-upload-img"
                             style="width: 80px;height: 80px; object-fit: cover;"
                             src="{$qn_domain}/{$tuzhi.celiang}?imageMogr2/auto-orient/thumbnail/!80x80r/gravity/Center/crop/80x80/quality/80/interlace/0">
                        <input type="hidden" id="celiang" value="{$tuzhi.celiang}">
                    </div>

                    <div class="layui-upload-drag upload_more" style="padding: 2px;"
                         onclick="checkTuzhi(this)">
                        <div style="margin-top: 5px;" class="layui-elip">
                            墙体拆改图
                        </div>
                        <img class="layui-upload-img"
                             style="width: 80px;height: 80px; object-fit: cover;"

                             src="{$qn_domain}/{$tuzhi.chaigai}?imageMogr2/auto-orient/thumbnail/!80x80r/gravity/Center/crop/80x80/quality/80/interlace/0">
                        <input type="hidden" id="chaigai" value="{$tuzhi.chaigai}">

                    </div>


                    <div class="layui-upload-drag upload_more" style="padding: 2px;"
                         onclick="checkTuzhi(this)">
                        <div style="margin-top: 5px;" class="layui-elip">
                            平面布局图
                        </div>
                        <img class="layui-upload-img"
                             style="width: 80px;height: 80px; object-fit: cover;"

                             src="{$qn_domain}/{$tuzhi.buju}?imageMogr2/auto-orient/thumbnail/!80x80r/gravity/Center/crop/80x80/quality/80/interlace/0">
                        <input type="hidden" id="buju" value="{$tuzhi.buju}">


                    </div>


                    <div class="layui-upload-drag upload_more" style="padding: 2px;"
                         onclick="checkTuzhi(this)">
                        <div style="margin-top: 5px;" class="layui-elip">
                            地面材质示意图
                        </div>
                        <img class="layui-upload-img"
                             style="width: 80px;height: 80px; object-fit: cover;"


                             src="{$qn_domain}/{$tuzhi.shiyi}?imageMogr2/auto-orient/thumbnail/!80x80r/gravity/Center/crop/80x80/quality/80/interlace/0">
                        <input type="hidden" id="shiyi" value="{$tuzhi.shiyi}">


                    </div>



                    <div class="layui-upload-drag upload_more" style="padding: 2px;"
                         onclick="checkTuzhi(this)">
                        <div style="margin-top: 5px;" class="layui-elip">
                            顶面天花布局图
                        </div>
                        <img class="layui-upload-img"
                             style="width: 80px;height: 80px; object-fit: cover;"

                             src="{$qn_domain}/{$tuzhi.dingmian}?imageMogr2/auto-orient/thumbnail/!80x80r/gravity/Center/crop/80x80/quality/80/interlace/0">
                        <input type="hidden" id="dingmian" value="{$tuzhi.dingmian}">

                    </div>

                    <div class="layui-upload-drag upload_more" style="padding: 2px;"
                         onclick="checkTuzhi(this)">
                        <div style="margin-top: 5px;" class="layui-elip">
                            顶面天花尺寸图
                        </div>
                        <img class="layui-upload-img"
                             style="width: 80px;height: 80px; object-fit: cover;"


                             src="{$qn_domain}/{$tuzhi.dingmian_chichun}?imageMogr2/auto-orient/thumbnail/!80x80r/gravity/Center/crop/80x80/quality/80/interlace/0">
                        <input type="hidden" id="dingmian_chichun"
                               value="{$tuzhi.dingmian_chichun}">

                    </div>


                    <div class="layui-upload-drag upload_more" style="padding: 2px;"
                         onclick="checkTuzhi(this)">
                        <div style="margin-top: 5px;" class="layui-elip">
                            开关面板示意图
                        </div>
                        <img class="layui-upload-img"
                             style="width: 80px;height: 80px; object-fit: cover;"

                             src="{$qn_domain}/{$tuzhi.kaiguan}?imageMogr2/auto-orient/thumbnail/!80x80r/gravity/Center/crop/80x80/quality/80/interlace/0">
                        <input type="hidden" id="kaiguan" value="{$tuzhi.kaiguan}">


                    </div>

                    <div class="layui-upload-drag upload_more " style="padding: 2px;"
                         onclick="checkTuzhi(this)">
                        <div style="margin-top: 5px;" class="layui-elip">
                            墙面装饰布局图
                        </div>
                        <img class="layui-upload-img"
                             style="width: 80px;height: 80px; object-fit: cover;"

                             src="{$qn_domain}/{$tuzhi.qiangmian}?imageMogr2/auto-orient/thumbnail/!80x80r/gravity/Center/crop/80x80/quality/80/interlace/0">
                        <input type="hidden" id="qiangmian" value="{$tuzhi.qiangmian}">


                    </div>




                    <div class="layui-upload-drag upload_more" style="padding: 2px;"
                         onclick="checkTuzhi(this)">
                        <div style="margin-top: 5px;" class="layui-elip">
                            平面索引图
                        </div>
                        <img class="layui-upload-img"
                             style="width: 80px;height: 80px; object-fit: cover;"

                             src="{$qn_domain}/{$tuzhi.suoyin}?imageMogr2/auto-orient/thumbnail/!80x80r/gravity/Center/crop/80x80/quality/80/interlace/0">
                        <input type="hidden" id="suoyin" value="{$tuzhi.suoyin}">


                    </div>




                    <div class="layui-upload-drag upload_more" style="padding: 2px;"
                         onclick="checkTuzhi(this)">
                        <div style="margin-top: 5px;" class="layui-elip">
                            立面图
                        </div>
                        <img class="layui-upload-img"
                             style="width: 80px;height: 80px; object-fit: cover;"

                             src="{$qn_domain}/{$tuzhi.limian}?imageMogr2/auto-orient/thumbnail/!80x80r/gravity/Center/crop/80x80/quality/80/interlace/0">
                        <input type="hidden" id="limian" value="{$tuzhi.limian}">


                    </div>

                    <div class="layui-upload-drag upload_more" style="padding: 2px;"
                         onclick="checkTuzhi(this)">
                        <div style="margin-top: 5px;" class="layui-elip">
                            剖面图
                        </div>
                        <img class="layui-upload-img"
                             style="width: 80px;height: 80px; object-fit: cover;"
                             src="{$qn_domain}/{$tuzhi.paomian}?imageMogr2/auto-orient/thumbnail/!80x80r/gravity/Center/crop/80x80/quality/80/interlace/0">
                        <input type="hidden" id="paomian" value="{$tuzhi.paomian}">

                    </div>

                </div>
            </div>




            <div class="layui-form-item">
                <label class="layui-form-label">施工标准</label>
                <div class="layui-input-inline">
                    <select name=""  lay-filter="biaozhun">
                        <option value="">请选择</option>
                        {foreach $biaozhun as $key=>$v}
                        <option value="{$v.content}">{$v.title}</option>
                        {/foreach}
                    </select>
                </div>
            </div>



            <div class="layui-form-item layui-form-text" style="margin-bottom: 80px">
                <label class="layui-form-label">标准内容</label>
                <div class="layui-input-block">
                    <textarea name="biaozhun" id="bz_content" lay-verify="required" placeholder="请输入内容" rows="15" class="layui-textarea"></textarea>
                </div>
            </div>



            <div class="layui-form-item form-footer2">
                <div class="layui-input-block">
                    <button class="layui-btn" lay-submit lay-filter="add_stage">立即提交</button>
                    <button type="button" onclick="parent.layer.closeAll();" class="layui-btn layui-btn-primary">关闭</button>
                </div>
            </div>
        </form>
        </div>
    </div>
</div>
</div>


<script>
    //项目id
    var id = "{$Request.param.id}";
    // console.log(id);

    // var app = new Vue({
    //     el: '#app',
    //     data: {
    //         cailiao: "选择",
    //         items: [],
    //         goods: [
    //             {
    //                 goods_id: 1,
    //                 goods_name: '感应开关',
    //                 goods_num: 80,
    //             }
    //         ],
    //     },
    //     methods: {
    //
    //         delGood: function (index) {
    //             this.list.splice(index, 1);
    //         },
    //     },
    // });

    function checkTuzhi(that) {
        if ($(that).hasClass("check")) {
            $(that).removeClass("check");
        }
        else {
            $(that).addClass("check");
        }

    }


    // function set_goods() {
    //
    // }


    layui.use(['form', 'upload', 'laydate'], function () {
        var $ = layui.$
            , layer = layui.layer
            , form = layui.form;
        var upload = layui.upload;
        var laydate = layui.laydate;


        form.on('select(biaozhun)', function(data){
//            console.log(data.elem); //得到select原始DOM对象
            console.log(data.value); //得到被选中的值
//            console.log(data.othis); //得到美化后的DOM对象
            var content=$('#bz_content');
            content.val(content.val()+'\n'+data.value);


        });


        //网站设置
        //监听submit提交
        form.on('submit(add_stage)', function (obj) {
            // var worker = "";
            // var groupCheckbox = $("input[name='wt']");
            // // console.log("c"+groupCheckbox[0]);
            // for (var i = 0; i < groupCheckbox.length; i++) {
            //     if (groupCheckbox[i].checked) {
            //         var val = groupCheckbox[i].value;
            //         // console.log("c1223"+val);
            //         if (worker.length > 0) {
            //             worker += "," + val;
            //         } else {
            //             worker += val;
            //         }
            //
            //     }
            // }
            var tuzhi = [];

            var tu = $(".check");
            tu.each(function (index, ele) {
                var inp2 = $(ele).find('input');
                var e = {};
                e[inp2.attr('id')] = inp2.val();
                tuzhi.push(e);

            });


            obj.field["tuzhi"] = tuzhi;

            //console.log("ck"+ worker);
//            obj.field["worker_type"] = worker;
//             var localGood = layui.data('good');
//             obj.field["material"] = [];
//             if (!jQuery.isEmptyObject(localGood.goodList)) {
//                 obj.field["material"] = localGood.goodList;
//             }
            obj.field["s"] = 'add';
            obj.field["project_id"] = id;
//            layer.msg(JSON.stringify(obj.field)); obj.field为当前容器的全部表单字段，名值对形式：{name: value}
            $.post("{:url('add_stage')}", obj.field, function (res) {
                if (res.code == 1) {
                   // layer.msg(res.msg, {icon: 1});
                    // app.cailiao = "选择";
                    $('#pic1 img').attr('src', '/res/img/thumb.png');
                    $('.layui-form')[0].reset();
                    // layui.data('good', null);

                    parent.layer.closeAll();
                    parent.layer.msg(res.msg, {icon: 1});
                    parent.init();

                    return false;
                } else {
                    layer.msg(res.msg, {icon: 2}, function () {

                    })
                    return false;
                }

            });
            return false;
        });

        //拖拽上传
        upload.render({
            elem: '#pic1'
            , url: '/tool/qiniu/upload'
            , before: function () {
                layer.load(2);
            }
            , done: function (res) {
                layer.closeAll();
                console.log(res)
                $('#pic1 img').attr('src', res.data.url);//完整url
                $('#pic1 input').val(res.data.pic);//存入数据库中的部分url
            }
        });
        //执行一个laydate实例
        laydate.render({
            elem: '#time' //指定元素
        });

        // laydate.render({
        //     elem: '#time2' //指定元素
        // });
    });

    // function select_material() {
    //     layer.open({
    //         type: 2,
    //         title: '材料',
    //         shadeClose: true,
    //         shade: 0.01,
    //         area: ['80%', '80%'],
    //         content: "{:url('select_material')}",
    //     });
    // }
</script>
</body>
</html>